<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<meta http-equiv="x-UA-Compatible" content="ie=Edge">
   	<meta name="viewport" content="width=device-width, initial-scale=1">
   	<title>Crafty - Storage</title>
	<link type="text/css" rel="stylesheet" href="../craftyjs-site.css" />
	<link rel="shortcut icon" href="../favicon.ico">
</head>
<body>
	<div id = "header-background"> </div>
	<div id = "page-frame">
	<div id="header">
		<nav class="navbar">
  			<div class="container-fluid">
  				<div class="navbar-header">
  					<a class="navbar-brand" href="../"> <img class="logo" src="../images/text-logo.png" /> </a>
  					
				</div>
				<div class="collapse navbar-collapse navbar-right" id="bs-example-navbar-collapse-1">
					<ul class="nav navbar-nav">
						<li><a href="../">首页</a></li>
						<li><a href="../getting-started/">快速开始</a></li>
						<li><a href="../documentation/">文档</a></li>
						<li><a href="../api/">API</a></li>
						<li><a href="../components/">组件</a></li>
						<li class="emph"><a href="../#install">下载</a></li>
					</ul>
				</div>
			</div>
		</nav>
	</div>


	<div id="main">
		<div id="content" class="container">
			



<div id="docs"><div class="toc-holder" id="doc-nav"><ul id="doc-level-one"><li><a href="events.html">List of Events</a></li><li class="category">Core<ul class="category-list"><li><a href="Crafty.html">Crafty</a></li><li><a href="Crafty Core.html">Crafty Core</a></li><li><a href="Crafty-bind.html">Crafty.bind()</a></li><li><a href="Crafty-c.html">Crafty.c()</a></li><li><a href="Crafty-clone.html">Crafty.clone()</a></li><li><a href="Crafty-defineField.html">Crafty.defineField()</a></li><li><a href="Crafty-e.html">Crafty.e()</a></li><li><a href="Crafty-extend.html">Crafty.extend()</a></li><li><a href="Crafty-frame.html">Crafty.frame()</a></li><li><a href="Crafty-getVersion.html">Crafty.getVersion()</a></li><li><a href="Crafty-init.html">Crafty.init()</a></li><li><a href="Crafty-isPaused.html">Crafty.isPaused()</a></li><li><a href="Crafty-one.html">Crafty.one()</a></li><li><a href="Crafty-pause.html">Crafty.pause()</a></li><li><a href="Crafty-s.html">Crafty.s()</a></li><li><a href="Crafty-settings.html">Crafty.settings</a></li><li><a href="Crafty-stage.html">Crafty.stage</a></li><li><a href="Crafty-stop.html">Crafty.stop()</a></li><li><a href="Crafty-support.html">Crafty.support</a></li><li><a href="Crafty-trigger.html">Crafty.trigger()</a></li><li><a href="Crafty-unbind.html">Crafty.unbind()</a></li><li><a href="Crafty-uniqueBind.html">Crafty.uniqueBind()</a></li></ul></li><li class="category">2D<ul class="category-list"><li><a href="2D.html">2D</a></li><li><a href="AngularMotion.html">AngularMotion</a></li><li><a href="Collision.html">Collision</a></li><li><a href="Crafty-circle.html">Crafty.circle</a></li><li><a href="Crafty-diamondIso.html">Crafty.diamondIso</a></li><li><a href="Crafty-HashMap.html">Crafty.HashMap</a></li><li><a href="Crafty-isometric.html">Crafty.isometric</a></li><li><a href="Crafty-map.html">Crafty.map</a></li><li><a href="Crafty-math-Matrix2D.html">Crafty.math.Matrix2D</a></li><li><a href="Crafty-math-Vector2D.html">Crafty.math.Vector2D</a></li><li><a href="Crafty-polygon.html">Crafty.polygon</a></li><li><a href="Crafty-raycast.html">Crafty.raycast()</a></li><li><a href="Crafty-rectManager.html">Crafty.rectManager</a></li><li><a href="Gravity.html">Gravity</a></li><li><a href="GroundAttacher.html">GroundAttacher</a></li><li><a href="Motion.html">Motion</a></li><li><a href="Supportable.html">Supportable</a></li></ul></li><li class="category">Animation<ul class="category-list"><li><a href="Crafty-easing.html">Crafty.easing</a></li><li><a href="SpriteAnimation.html">SpriteAnimation</a></li><li><a href="Tween.html">Tween</a></li></ul></li><li class="category">Assets<ul class="category-list"><li><a href="Crafty-asset.html">Crafty.asset()</a></li><li><a href="Crafty-assets.html">Crafty.assets</a></li><li><a href="Crafty-imageWhitelist.html">Crafty.imageWhitelist()</a></li><li><a href="Crafty-load.html">Crafty.load()</a></li><li><a href="Crafty-paths.html">Crafty.paths()</a></li><li><a href="Crafty-removeAssets.html">Crafty.removeAssets()</a></li></ul></li><li class="category">Audio<ul class="category-list"><li><a href="Crafty-audio.html">Crafty.audio</a></li></ul></li><li class="category">Controls<ul class="category-list"><li><a href="Controllable.html">Controllable</a></li><li><a href="Controls.html">Controls</a></li><li><a href="Draggable.html">Draggable</a></li><li><a href="Fourway.html">Fourway</a></li><li><a href="Jumper.html">Jumper</a></li><li><a href="Multiway.html">Multiway</a></li><li><a href="Twoway.html">Twoway</a></li></ul></li><li class="category">Debug<ul class="category-list"><li><a href="Crafty-error.html">Crafty.error()</a></li><li><a href="Crafty-log.html">Crafty.log()</a></li><li><a href="DebugCanvas.html">DebugCanvas</a></li><li><a href="DebugPolygon.html">DebugPolygon</a></li><li><a href="DebugRectangle.html">DebugRectangle</a></li><li><a href="SolidAreaMap.html">SolidAreaMap</a></li><li><a href="SolidHitBox.html">SolidHitBox</a></li><li><a href="VisibleMBR.html">VisibleMBR</a></li><li><a href="WiredAreaMap.html">WiredAreaMap</a></li><li><a href="WiredHitBox.html">WiredHitBox</a></li></ul></li><li class="category">Events<ul class="category-list"><li><a href="Crafty-addEvent.html">Crafty.addEvent()</a></li><li><a href="Crafty-bind.html">Crafty.bind()</a></li><li><a href="Crafty-one.html">Crafty.one()</a></li><li><a href="Crafty-removeEvent.html">Crafty.removeEvent()</a></li><li><a href="Crafty-trigger.html">Crafty.trigger()</a></li><li><a href="Crafty-unbind.html">Crafty.unbind()</a></li><li><a href="Crafty-uniqueBind.html">Crafty.uniqueBind()</a></li></ul></li><li class="category">Game Loop<ul class="category-list"><li><a href="Crafty-timer.html">Crafty.timer</a></li></ul></li><li class="category">Graphics<ul class="category-list"><li><a href="Canvas.html">Canvas</a></li><li><a href="CanvasLayer.html">CanvasLayer</a></li><li><a href="Color.html">Color</a></li><li><a href="Crafty-assignColor.html">Crafty.assignColor()</a></li><li><a href="Crafty-background.html">Crafty.background()</a></li><li><a href="Crafty-createLayer.html">Crafty.createLayer()</a></li><li><a href="Crafty-defaultShader.html">Crafty.defaultShader()</a></li><li><a href="Crafty-domHelper.html">Crafty.domHelper</a></li><li><a href="Crafty-pixelart.html">Crafty.pixelart()</a></li><li><a href="Crafty-sprite.html">Crafty.sprite()</a></li><li><a href="Crafty-WebGLShader.html">Crafty.WebGLShader()</a></li><li><a href="DOM.html">DOM</a></li><li><a href="DomLayer.html">DomLayer</a></li><li><a href="HTML.html">HTML</a></li><li><a href="Image.html">Image</a></li><li><a href="Particles.html">Particles</a></li><li><a href="Renderable.html">Renderable</a></li><li><a href="Sprite.html">Sprite</a></li><li><a href="Text.html">Text</a></li><li><a href="WebGL.html">WebGL</a></li><li><a href="WebGLLayer.html">WebGLLayer</a></li></ul></li><li class="category">Input<ul class="category-list"><li><a href="AreaMap.html">AreaMap</a></li><li><a href="Button.html">Button</a></li><li><a href="Crafty-findPointerEventTargetByComponent.html">Crafty.findPointerEventTargetByComponent()</a></li><li><a href="Crafty-keyboardDispatch.html">Crafty.keyboardDispatch()</a></li><li><a href="Crafty-keydown.html">Crafty.keydown</a></li><li><a href="Crafty-keys.html">Crafty.keys</a></li><li><a href="Crafty-lastEvent.html">Crafty.lastEvent</a></li><li><a href="Crafty-mouseButtons.html">Crafty.mouseButtons</a></li><li><a href="Crafty-mouseDispatch.html">Crafty.mouseDispatch()</a></li><li><a href="Crafty-mouseWheelDispatch.html">Crafty.mouseWheelDispatch()</a></li><li><a href="Crafty-multitouch.html">Crafty.multitouch()</a></li><li><a href="Crafty-selected.html">Crafty.selected</a></li><li><a href="Crafty-touchDispatch.html">Crafty.touchDispatch()</a></li><li><a href="Keyboard.html">Keyboard</a></li><li><a href="Mouse.html">Mouse</a></li><li><a href="MouseDrag.html">MouseDrag</a></li><li><a href="Touch.html">Touch</a></li></ul></li><li class="category">Misc<ul class="category-list"><li><a href="Crafty-addEvent.html">Crafty.addEvent()</a></li><li><a href="Crafty-device.html">Crafty.device</a></li><li><a href="Crafty-removeEvent.html">Crafty.removeEvent()</a></li><li><a href="Crafty-support.html">Crafty.support</a></li></ul></li><li class="category">Model<ul class="category-list"><li><a href="Model.html">Model</a></li></ul></li><li class="category">Scenes<ul class="category-list"><li><a href="Crafty-scene.html">Crafty.scene()</a></li></ul></li><li class="category">Stage<ul class="category-list"><li><a href="Crafty-background.html">Crafty.background()</a></li><li><a href="Crafty-scene.html">Crafty.scene()</a></li><li><a href="Crafty-viewport.html">Crafty.viewport</a></li></ul></li><li class="category">Utilities<ul class="category-list"><li><a href="Crafty-math.html">Crafty.math</a></li><li><a href="Delay.html">Delay</a></li><li><a href="Storage.html">Storage</a></li></ul></li></ul></div><div id="doc-content" class="doc-page-holder"><div class="doc-page"><h1>Storage <span></span></h1><div class="doclet" id="Storage"><span class="markdown"><p>Very simple way to get and set values, which will persist when the browser is closed also.
Storage wraps around HTML5 Web Storage, which is well-supported across browsers and platforms, but limited to 5MB total storage per domain.
Storage is also available for node, which is permanently persisted to the <code>./localStorage</code> folder - take care of removing entries. Note that multiple Crafty instances use the same storage, so care has to be taken not to overwrite existing entries.</p>
</span></div><div><h4>Methods</h4><ul class="page-toc"><li><a href="#Crafty-storage">Crafty.storage()</a></li><li><a href="#Crafty-storage-remove">Crafty.storage.remove()</a></li></ul><div class="doclet" id="Crafty-storage"><a href="#doc-nav" class="doc-top">Back to top</a><h2 class="doclet-header">Crafty.storage()</h2><div class="crafty-method"><code class="signature"><span class="sig-phrase"><span class="sig-noun">Crafty.storage</span></span><span class="sig-seperator">(</span><span class="sig-phrase"><span class="sig-qualifier">String </span><span class="sig-noun">key</span></span><span class="sig-seperator">)</span></code><dl class="parameter"><dt> key </dt><dd><span class="markdown"><p>a key you would like to get from the storage.</p>
</span></dd></dl><dl class="parameter returns"><dt class="returns"> [Returns] </dt><dd><span class="markdown"><p>The stored value, or <code>null</code> if none saved under that key exists</p>
</span></dd></dl></div><div class="crafty-method"><code class="signature"><span class="sig-phrase"><span class="sig-noun">Crafty.storage</span></span><span class="sig-seperator">(</span><span class="sig-phrase"><span class="sig-qualifier">String </span><span class="sig-noun">key</span></span><span class="sig-seperator">,</span><span class="sig-phrase"><span class="sig-qualifier"> </span><span class="sig-qualifier">String </span><span class="sig-noun">value</span></span><span class="sig-seperator">)</span></code><dl class="parameter"><dt> key </dt><dd><span class="markdown"><p>the key you would like to save the data under.</p>
</span></dd></dl><dl class="parameter"><dt> value </dt><dd><span class="markdown"><p>the value you would like to save.</p>
</span></dd></dl></div><div class="crafty-method"><code class="signature"><span class="sig-phrase"><span class="sig-noun">Crafty.storage</span></span><span class="sig-seperator">(</span><span class="sig-phrase"><span class="sig-qualifier">String </span><span class="sig-noun">key</span></span><span class="sig-seperator">,</span><span class="sig-phrase"><span class="sig-qualifier"> </span><span class="sig-noun"></span></span><span class="sig-seperator">[</span><span class="sig-phrase"><span class="sig-qualifier">Object </span><span class="sig-noun">value</span></span><span class="sig-seperator">,</span><span class="sig-phrase"><span class="sig-qualifier"> </span><span class="sig-qualifier">Array </span><span class="sig-noun">value</span></span><span class="sig-seperator">,</span><span class="sig-phrase"><span class="sig-qualifier"> </span><span class="sig-qualifier">Boolean </span><span class="sig-noun">value</span></span><span class="sig-seperator">])</span></code><dl class="parameter"><dt> key </dt><dd><span class="markdown"><p>the key you would like to save the data under.</p>
</span></dd></dl><dl class="parameter"><dt> value </dt><dd><span class="markdown"><p>the value you would like to save, can be an Object or an Array.</p>
</span></dd></dl></div><span class="markdown"><p><code>Crafty.storage</code> is used synchronously to either get or set values.</p>
<p>You can store booleans, strings, objects and arrays.</p>
</span><div class="note"><span class="markdown"><p><strong>Note:</strong> Because the underlying method is synchronous, it can cause slowdowns if used frequently during gameplay. You should aim to load or save data at reasonable times such as on level load, or in response to specific user actions.</p>
</span></div><div class="note"><span class="markdown"><p><strong>Note:</strong> If used in a cross-domain context, the localStorage might not be accessible.</p>
</span></div><div class="example"><h4>Example</h4><span class="markdown"><p>Get an already stored value</p>
<pre><code class="hljs "><span class="hljs-keyword">var</span> playername = Crafty.storage(<span class="hljs-string">'playername'</span>);</code></pre></span></div><div class="example"><h4>Example</h4><span class="markdown"><p>Save a value</p>
<pre><code class="hljs ">Crafty.storage(<span class="hljs-string">'playername'</span>, <span class="hljs-string">'Hero'</span>);</code></pre></span></div><div class="example"><h4>Example</h4><span class="markdown"><p>Test to see if a value is already there.</p>
<pre><code class="hljs "><span class="hljs-keyword">var</span> heroname = Crafty.storage(<span class="hljs-string">'name'</span>);
<span class="hljs-keyword">if</span>(!heroname){
  <span class="hljs-comment">// Maybe ask the player what their name is here</span>
  heroname = <span class="hljs-string">'Guest'</span>;
}
<span class="hljs-comment">// Do something with heroname</span></code></pre></span></div></div><div class="doclet" id="Crafty-storage-remove"><a href="#doc-nav" class="doc-top">Back to top</a><h2 class="doclet-header">Crafty.storage.remove()</h2><div class="crafty-method"><code class="signature"><span class="sig-phrase"><span class="sig-noun">Crafty.storage.remove</span></span><span class="sig-seperator">(</span><span class="sig-phrase"><span class="sig-qualifier">String </span><span class="sig-noun">key</span></span><span class="sig-seperator">)</span></code><dl class="parameter"><dt> key </dt><dd><span class="markdown"><p>a key where you will like to delete the value of.</p>
</span></dd></dl></div><span class="markdown"><p>Generally you do not need to remove values from localStorage, but if you do
store large amount of text, or want to unset something you can do that with
this function.</p>
</span><div class="example"><h4>Example</h4><span class="markdown"><p>Get an already stored value</p>
<pre><code class="hljs ">Crafty.storage.remove(<span class="hljs-string">'playername'</span>);</code></pre></span></div></div></div></div></div></div>
			
		</div>
	</div>
	<div class="clearer"></div>
	<div id="footer">
		<div id="contact">
			<a href="https://groups.google.com/forum/#!forum/craftyjs">
				<img src="../images/google.png" />
				google groups</a>
			<a href="mailto:starwed@gmail.com">
				<img src="../images/email.png" />
				starwed@gmail.com</a>
			<a href="https://github.com/craftyjs/Crafty">
				<img src="../images/github.png" />
				github</a>
		</div>
		<ul>
			<li><a href="../">首页</a></li>
				<li><a href="../getting-started/">快速开始</a></li>
				<li><a href="../documentation/">文档</a></li>
				<li><a href="../api/">API</a></li>
				<li><a href="../components/">组件</a></li>
				<li class="emph"><a href="../#install">下载</a></li>
		</ul>
		<p>
			&copy; Crafty 2010-2015. Crafty is distributed under the <a href="http://en.wikipedia.org/wiki/MIT_License">MIT License</a>.
		</p>
	</div>
</div>
</body>
</html>
